<%--
  Created by IntelliJ IDEA.
  User: xiaoyuyu
  Date: 2019/7/3
  Time: 22:28
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>

<head>
    <meta charset="utf-8">
    <title>
        X-admin v1.0
    </title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../../css/x-admin.css" media="all">
</head>

<body>
<div class="x-body">
    <form class="layui-form">
        <div class="layui-form-item">
            <div class="layui-input-inline">
                <input type="hidden" id="L_id" name="id" required="" lay-verify="id"
                       autocomplete="off" class="layui-input" value="${product.id}">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_bar_code" class="layui-form-label">
                <span class="x-red">*</span>条码
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_bar_code" name="bar_code" required="" lay-verify="bar_code"
                       autocomplete="off" class="layui-input" ovalue="${product.bar_code}" value="${product.bar_code}">
            </div>

        </div>
        <div class="layui-form-item">
            <label for="L_name" class="layui-form-label">
                <span class="x-red">*</span>商品名称
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_name" name="name" required="" lay-verify="name"
                       autocomplete="off" class="layui-input" value="${product.name}">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_unit" class="layui-form-label">
                <span class="x-red">*</span>单位
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_unit" name="unit" required="" lay-verify="unit"
                       autocomplete="off" class="layui-input" value="${product.unit}">
            </div>
            <!--<div class="layui-form-mid layui-word-aux">
                6到16个字符
            </div>-->
        </div>
        <div class="layui-form-item">
            <label for="L_price" class="layui-form-label">
                <span class="x-red">*</span>当前售价
            </label>
            <div class="layui-input-inline">
                <input type="number" id="L_price" name="price" required="" lay-verify="price"
                       autocomplete="off" class="layui-input" value="${product.price}">
            </div>
        </div>

        <div class="layui-form-item">
            <label for="L_amount" class="layui-form-label">
                <span class="x-red">*</span>数量
            </label>
            <div class="layui-input-inline">
                <input type="number" id="L_amount" name="amount" required="" lay-verify="amount"
                       autocomplete="off" class="layui-input" value="${product.amount}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label" style="width:60px">所属分类</label>
            <div class="layui-input-inline" style="width:120px;text-align: left">
                <select name="classify_id" id="classify_id" value="${product.classify_id}">
                    <option value="0">顶级分类</option>
                    <%--<option value="1">顶级分类2</option>--%>
                    <%--<c:forEach items="${classifies}" var="classifyInfo">
                        <option value="${classifyInfo.code}">${classifyInfo.name}</option>
                    </c:forEach>--%>

                </select>
            </div>
            <%--<div class="layui-input-inline" style="width:120px">
                <input type="text" name="name"  placeholder="分类名" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline" style="width:80px">
                <button class="layui-btn"  lay-submit="" lay-filter="add"><i class="layui-icon">&#xe608;</i>增加</button>
            </div>--%>
        </div>
        <div class="layui-form-item">
            <%--            <label for="L_repass" class="layui-form-label">
                        </label>--%>
            <button  class="layui-btn" lay-filter="edit" lay-submit="">
                修改
            </button>
        </div>
    </form>
</div>
<script src="../../lib/layui/layui.js" charset="utf-8">
</script>
<script src="../../js/x-layui.js" charset="utf-8">
</script>
<script src="../../js/jquery.min.js" charset="utf-8"></script>
<script>
    //加载选项的时候执行



    layui.use(['form','layer'], function(){
        $ = layui.jquery;
        var form = layui.form()
            ,layer = layui.layer;

        var value = $("#classify_id").attr("value");
        console.log(value);

        $.ajax({
            type:"POST",
            url:"${pageContext.request.contextPath}/findAllClassify",
            async:false,
            success:function (data) {
                console.log(data);
                $.each(data,function (index,obj) {
                    console.log(obj);
                    //添加选择项

                    $("#classify_id").append("<option value=\""+ obj.code +"\">"+ obj.name +"</option>");


                });
                //选择当前商品的类别
                $.each(data,function (index,obj) {
                    // console.log(obj);
                    //添加选择项
                    if(obj.code == value){
                        // $("#classify_id").append("<option value=\""+ obj.code +"\">"+ obj.name +"</option>");
                        $("#classify_id").val(value);
                    }

                });
                form.render('select');
            }
        });

        //自定义验证规则
        form.verify({
            bar_code: function (value) {
                var pattner = /^\d+$/;
                if(!pattner.test(value)){
                    return "条码格式不正确";
                }
                var msg = 0;
                //验证条形码是否已经存在了
                $.ajax({
                    type:"POST",
                    url:"${pageContext.request.contextPath}/findProductByBarCode",
                    data:{"code":value},
                    async:false,
                    success:function (data) {
                        console.log(data);
                        //获得旧值
                        var old_value = $("#L_bar_code").attr("ovalue");
                        console.log(old_value);
                        if(data.bar_code = old_value){
                            msg = 0;
                        }else {
                            msg = data.state_code;
                        }


                        // console.log(msg);
                    }

                });
                // console.log(msg);
                if(msg){
                    return "商品已经纪录在库，进货请上货操作";
                }
            }
        });

        //监听提交
        form.on('submit(edit)', function(data){
            console.log(data.field);
            //发异步，把数据提交
            $.ajax({
                type:"POST",
                url:"${pageContext.request.contextPath}/editProduct",
                data:data.field,
                async:false,
                success:function (rdata) {
                    // console.log(rdata);
                    if(rdata.state_code){
                        layer.alert("修改成功", {icon: 6},function () {
                            // 获得frame索引
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.pageContro(1,"");
                            //关闭当前frame
                            parent.layer.close(index);
                        });
                    }else{
                        layer.alert("修改失败", {icon: 5});
                    }
                }

            });
            return false;
        });


    });
</script>
</body>

</html>
